<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> 
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<c:set var="contextPath" value="${pageContext.request.contextPath}" ></c:set>
<!DOCTYPE html >
<html lang="en">
	<head>
		<link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/bootstrap.min.css" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/font-awesome.min.css" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/ace-fonts.css" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/ace.min.css" id="main-ace-style" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/ace-skins.min.css" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/ace-rtl.min.css" />
		<script src="${pageContext.request.contextPath}/static/assets/js/ace-extra.min.js"></script>
	</head>

	<body class="no-skin">
			<!-- /section:basics/sidebar -->
			<div class="main-content">
				<!-- #section:basics/content.breadcrumbs -->
				<div class="breadcrumbs" id="breadcrumbs">
					<script type="text/javascript">
						try{ace.settings.check('breadcrumbs' , 'fixed')}catch(e){}
					</script>

					<ul class="breadcrumb">
						<li>
							<i class="ace-icon fa fa-home home-icon"></i>
							<a href="#">Home</a>
						</li>

						<li>
							<a href="#">Tables</a>
						</li>
						<li class="active">Simple &amp; Dynamic</li>
					</ul><!-- /.breadcrumb -->

					<!-- #section:basics/content.searchbox -->
					<div class="nav-search" id="nav-search">
						<form class="form-search">
							<span class="input-icon">
								<input type="text" placeholder="Search ..." class="nav-search-input" id="nav-search-input" autocomplete="off" />
								<i class="ace-icon fa fa-search nav-search-icon"></i>
							</span>
						</form>
					</div><!-- /.nav-search -->

					<!-- /section:basics/content.searchbox -->
				</div>

				<!-- /section:basics/content.breadcrumbs -->
				<div class="page-content">
					<!-- #section:settings.box -->
					<div class="ace-settings-container" id="ace-settings-container">
						<div class="btn btn-app btn-xs btn-warning ace-settings-btn" id="ace-settings-btn">
							<i class="ace-icon fa fa-cog bigger-150"></i>
						</div>

						<div class="ace-settings-box clearfix" id="ace-settings-box">
							<div class="pull-left width-50">
								<!-- #section:settings.skins -->
								<div class="ace-settings-item">
									<div class="pull-left">
										<select id="skin-colorpicker" class="hide">
											<option data-skin="no-skin" value="#438EB9">#438EB9</option>
											<option data-skin="skin-1" value="#222A2D">#222A2D</option>
											<option data-skin="skin-2" value="#C6487E">#C6487E</option>
											<option data-skin="skin-3" value="#D0D0D0">#D0D0D0</option>
										</select>
									</div>
									<span>&nbsp; Choose Skin</span>
								</div>

								<!-- /section:settings.skins -->

								<!-- #section:settings.navbar -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-navbar" />
									<label class="lbl" for="ace-settings-navbar"> Fixed Navbar</label>
								</div>

								<!-- /section:settings.navbar -->

								<!-- #section:settings.sidebar -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-sidebar" />
									<label class="lbl" for="ace-settings-sidebar"> Fixed Sidebar</label>
								</div>

								<!-- /section:settings.sidebar -->

								<!-- #section:settings.breadcrumbs -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-breadcrumbs" />
									<label class="lbl" for="ace-settings-breadcrumbs"> Fixed Breadcrumbs</label>
								</div>

								<!-- /section:settings.breadcrumbs -->

								<!-- #section:settings.rtl -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-rtl" />
									<label class="lbl" for="ace-settings-rtl"> Right To Left (rtl)</label>
								</div>

								<!-- /section:settings.rtl -->

								<!-- #section:settings.container -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-add-container" />
									<label class="lbl" for="ace-settings-add-container">
										Inside
										<b>.container</b>
									</label>
								</div>

								<!-- /section:settings.container -->
							</div><!-- /.pull-left -->

							<div class="pull-left width-50">
								<!-- #section:basics/sidebar.options -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-hover" />
									<label class="lbl" for="ace-settings-hover"> Submenu on Hover</label>
								</div>

								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-compact" />
									<label class="lbl" for="ace-settings-compact"> Compact Sidebar</label>
								</div>

								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-highlight" />
									<label class="lbl" for="ace-settings-highlight"> Alt. Active Item</label>
								</div>

								<!-- /section:basics/sidebar.options -->
							</div><!-- /.pull-left -->
						</div><!-- /.ace-settings-box -->
					</div><!-- /.ace-settings-container -->

					<!-- /section:settings.box -->
					<div class="page-content-area">
						<div class="page-header">
							<h1>
								Tables
								<small>
									<i class="ace-icon fa fa-angle-double-right"></i>
									Static &amp; Dynamic Tables
								</small>
							</h1>
						</div><!-- /.page-header -->

						<div class="row">
							<div class="col-xs-12">
								<!-- PAGE CONTENT BEGINS -->
								<div class="row">
									<div class="col-xs-12">
										<table id="sample-table-1" class="table table-striped table-bordered table-hover" id = "subjectListTable">
											<thead>
												<tr>
												
													  <th>科目Id</th>
													    <th>科目名称</th>
													    <th>科目描述</th>
													        <th>试题数量</th>
													      <th>考试总时间</th>
													       <th>总分</th>
													       <th>状态</th>
													 <th>本科目得分</th>
													 <th>是否已参考</th>
													<th>操作</th>
												</tr>
											</thead>

											<tbody>
												<tr>												
												 <c:forEach items="${allSubject}" var="subject">
												  	<tr>
																								
													    <td>${subject.subId}</td>
													    <td>${subject.name}</td> 
													    <td>${subject.description}</td>
													    <td>${subject.testCount}</td>
													    <td>${subject.totalTime}</td>  
														 <td>${subject.totalScore}</td> 
														  <td>
														  <%--if () else if () else if ()     else  --%>
														  <c:choose>
														  	<c:when test="${subject.status == 0 }">
														  	<label class="label arrowed">已关闭</label>
														  	</c:when>
														  <c:otherwise>
														  <label class="label label-success arrowed-in arrowed-in-right">已开启</label>
														 </c:otherwise></c:choose>
														  </td>  
														 
												<td>${subject.score.score }</td>
														 
														  <td>
															<c:choose>
																  <c:when test="${subject.score.score == null }">
																  <label class="label label-success arrowed-in arrowed-in-right">未参考</label>
																  </c:when>
  															<c:otherwise>
																	  <label class="label arrowed">已参考</label>
																	</c:otherwise>
														  </c:choose>
														  </td>
														  
														  <td>
														  <c:choose>
														  <c:when test="${subject.score.score == null }">
														  <c:choose>
														  <c:when test="${subject.status == 0 }">
														  <a title="进入考试" disabled="disabled" class="btn btn-success btn-xs">
														  <i class="ace-icon fa fa-pencil"></i></a></c:when>
														  <c:otherwise>
														  <a   title="进  入  考  试"  href="${contextPath }/teacher/toTest/${subject.subId }"  class="btn btn-success btn-xs  to-test">
														  <i class="ace-icon fa fa-pencil"></i></a>
														  </c:otherwise>
														  
														  
														  </c:choose></c:when>
														  <c:when    test="${empty    subject.score.score    && subject.score.remainingExamTime > 0}">
														  <!--已经开始考试，中途关闭-->
														  <a    title="进入考试" href="${contextPath }/teacher/toTest/${subject.subId }"   class="btn btn-success btn-xs  to-test">
														  <i class="ace-icon fa fa-pencil"></i></a></c:when>
														  <c:otherwise>
														  <a title="查看成绩" scoreId="${subject.score.id }" class="btn btn-info btn-xs showScoreBtn"><i class="ace-icon fa fa-eye"></i></a>
														  </c:otherwise></c:choose>
														  </td>
										    				    
												  </tr>
												 </c:forEach>									

											</tbody>
										</table>
									</div><!-- /.span -->
								</div><!-- /.row -->
								
			<!--显示成绩－模态框（Modal）-->
			<div  class="modal fade"  id="showScoreModal"  tabindex="-1"  role="dialog"  aria-labelledby="showScoreModalLabel" aria-hidden="true">
				<div class="modal-dialog">
					<div class="modal-content">
						<div class="modal-header">
							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
								<h4 class="modal-title" id="showScoreModalLabel">查看科目成绩</h4>
								</div><div class="modal-body"><p>
								<label>用户名:</label><label id="userName">XXX</label></p><p>
								<label>科目名:</label><label id="subjectName">XXX</label></p><p>
								<label>考试时间:</label><label id="examTime">XXXX-XX-XX</label></p><p>
								<label>得分:</label><label id="score">XX</label></p></div>
								<div class="modal-footer"><button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
								<button id="scorePrint"type="button" class="btn btn-primary">打印</button>
								</div>
						</div><!--/.modal-content -->
					</div><!--/.modal -->
			</div>
	
	
	
	<div class="modal fade" id="loginTestModal" tabindex="-1" role="dialog" aria-labelledby="loginTestModalLabel">
			  <div class="modal-dialog">
			    <div class="modal-content">
			      <div class="modal-header">
			        <button type="button" class="close" data-dismiss="modal" aria-label="true">
			         &times;
			       	</button>
			        <h4 class="modal-title" id="loginTestModalLabel">
			      		登录考试</h4>
			      </div>
			      <div class="modal-body">
			       		<form id = "LoginForm" method="post">
												
															<label id="subId" name ="subId"></label>											
												<p><label>用户名：</label><input type="text" name="userId" placeholder="Username "  class="form-control"/></p>
			       								<p><label>密码：</label><input type="password" name="password" placeholder="Password "  class="form-control"/></p>
												
											</form>		       
			      </div>
			      <div class="modal-footer">
			        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
			         <button id="loginSave" type="button" class="btn btn-primary" >Login</button>
			      </div>
			    </div><!-- /.modal-content -->
			  </div><!-- /.modal-dialog -->
			</div><!-- /.modal -->
<script type="text/javascript">
			window.jQuery || document.write("<script src='${pageContext.request.contextPath}/static/assets/js/jquery.min.js'>"+"<"+"/script>");
		</script>

		<script type="text/javascript">
			if('ontouchstart' in document.documentElement) document.write("<script src='${pageContext.request.contextPath}/static/assets/js/jquery.mobile.custom.min.js'>"+"<"+"/script>");
		</script>

		<script src="${pageContext.request.contextPath}/static/assets/js/bootstrap.min.js"></script>
		<script src="${pageContext.request.contextPath}/static/lib/bootstrap-switch.js"></script>
		<!-- page specific plugin scripts -->
		<script src="${pageContext.request.contextPath}/static/assets/js/jquery.dataTables.min.js"></script>
		<script src="${pageContext.request.contextPath}/static/assets/js/jquery.dataTables.bootstrap.js"></script>

		<!-- ace scripts -->
		<script src="${pageContext.request.contextPath}/static/assets/js/ace-elements.min.js"></script>
		<script src="${pageContext.request.contextPath}/static/assets/js/ace.min.js"></script>
		<script src="${pageContext.request.contextPath}/static/lib/jquery.jqprint-0.3.js"></script>
		<script src="${pageContext.request.contextPath}/static/lib/jquery-migrate-1.1.0.js"></script>

		
								
<script type="text/javascript">		
/* 	function checkSelectedUser(selectedUser,userId){
				var targetCheck = null; //alert(targetCheck.outerHTML);
				targetCheck.checked=true;		
	} */

$(document).ready(function(){  
	$('.manage-subject-student-btn').click(function() {
		   var subId = $(this).parents("td").siblings("td").eq(0).text(); 
		$.ajax({
			type:'POST',
			url:'${pageContext.request.contextPath}/getStudentScore',
			data:{
				subjectId:subId
			},
			dataType:"json",
			success:function(data){
				var htmlString = '';
				var selectedUser = data.selectedUser; 		
				//得到所有这个科目关联的学生
				for(var i = 0;i<data.allUser.length;i++){
					var user = data.allUser[i];
				 	var checked = '';
				 	for(var j=0;i<data.selectedUser.length;j++){
				 		if(selectedUser[j] == user.userId){
				 			checked='checked="true"';
				 		}
				 	}
					htmlString += '<div class="checkbox">';
					htmlString += '  <label>';
					htmlString += '		<input name="subjectStudents" class="ace ace-checkbox-2" type="checkbox" '+ '" '; 
										+ user.userId + '" ' +checked+ '/>';
					htmlString += '   	<span class="lbl">'+user.userName+ '</span>';	
					htmlString += '	</label>';
					htmlString += '</div>';
				}
				$('#subjectStudentContent').html(htmlString);
				$('#subjectId').val(subId);
				
			} 
		}); 
		$('#modalSubjectName').text($(this).parents("td").siblings("td").eq(1).text()); 
		$('#subjectStudentModal').modal('show');	

	});  
	
})  
</script>
	<script type="text/javascript">
	$(function() {
		//点击按钮后。在modal里面更新数据
		$('.showScoreBtn').click(function() {
			var scoreId = $(this).attr('scoreId');
			$.ajax({
				type: 'POST',
				url: '${pageContext.request.contextPath}/teacher/showScore',
				data: {scoreId: scoreId},
				dataType: 'json',
				success: function(data){
					$('#userName').text(data.userName);
					$('#subjectName').text(data.subjectName);
					$('#examTime').text(data.examTimeString);
					$('#score').text(data.score);
					
					}}
				);
			$('#showScoreModal').modal('show');
			});
		
		//使用jqprint打印modal框内的内容
		$('#scorePrint').click(function() {
			$('#showScoreModal .modal-body').jqprint();
			});
	
		
		$('.to-test').click(function(){
			return confirm("是否确认要参加该科目考试？");
		});

		
});
		
		
	
	
	
	
	
	
	
	
	</script>
	<link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/ace.onpage-help.css" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/static/docs/assets/js/themes/sunburst.css" />

		<script type="text/javascript"> ace.vars['base'] = '..'; </script>
		<script src="${pageContext.request.contextPath}/static/assets/js/ace/elements.onpage-help.js"></script>
		<script src="${pageContext.request.contextPath}/static/assets/js/ace/ace.onpage-help.js"></script>
		<script src="${pageContext.request.contextPath}/static/docs/assets/js/rainbow.js"></script>
		<script src="${pageContext.request.contextPath}/static/docs/assets/js/language/generic.js"></script>
		<script src="${pageContext.request.contextPath}/static/docs/assets/js/language/html.js"></script>
		<script src="${pageContext.request.contextPath}/static/docs/assets/js/language/css.js"></script>
		<script src="${pageContext.request.contextPath}/static/docs/assets/js/language/javascript.js"></script>



	
	
	</body>
</html>
